<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>fetch-get</title>
    <script src="../vue2.js"></script>
</head>
<body>
<div id="box">
    <button @click="handleFetch">ajax-fetch</button>
</div>
<script>
    new Vue({
        el: "#box",
        data: {
            datalist: []
        },
        methods: {
            handleFetch() {
                fetch("./json/maizuo.json")
                    // res.json返回的是对象；res.text返回的是字符串
                    .then(res => res.json())   //状态码，响应头，还没能得到真正数据
                    .then(res => {
                        console.log(res.data.films)
                        this.datalist = res.data.films
                    })
                    .catch(err => {
                        console.log('error')
                    })  //出错
            }
        }
    })
</script>
</body>
</html>